<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ include file="/page/public/public-taglibs.jsp"%>
<c:set var="isEditable" value="${'TRUE' eq ISEDIT}" />
<c:set var="isCreative" value="${'TRUE' eq ISNEW}" />

<!DOCTYPE html>
<html lang="en">
<head>
<%@ include file="/page/public/public-css.jsp"%>

<style>
.mainClass {
	
}
.mainClass .btn{
	border: 1px dashed #aaa;
}
.previewClass {
	height: 300px;
	padding-bottom: 25px;
}
</style>
</head>

<body class="no-skin">
	<!-- /section:basics/navbar.layout -->
	<div class="main-container" id="main-container">

		<!-- /section:basics/sidebar -->
		<div class="main-content">
			<div class="main-content-inner">
				<div class="page-content">

					<div>
						<div id="user-profile-3" class="user-profile row">
							<div class="col-sm-offset-1 col-sm-10">

								<div class="space"></div>
								<div class="tabbable">
										<ul class="nav nav-tabs padding-16">
											<shiro:hasPermission name="user:update">
												<li id="tab-base" class="active" style="display: none"><a
													data-toggle="tab" href="#edit-basic"> <i
														class="green ace-icon fa fa-pencil-square-o bigger-125"></i>
														基本信息
												</a></li>
												<li id="tab-security" style="display: none"><a
													data-toggle="tab" href="#edit-password"> <i
														class="blue ace-icon fa fa-key bigger-125"></i> 安全设置
												</a></li>
											</shiro:hasPermission>

											<shiro:hasPermission name="user:resetpwd">
												<li id="tab-resetpwd" style="display: none"><a
													data-toggle="tab" href="#reset-password"> <i
														class="blue ace-icon fa fa-key bigger-125"></i> 密码重置
												</a></li>
											</shiro:hasPermission>

											<shiro:hasPermission name="user:gaverole">
												<li id="tab-roles" style="display: none"><a
													data-toggle="tab" href="#user-roles"> <i
														class="blue ace-icon fa fa-key bigger-125"></i> 用户赋权
												</a></li>
											</shiro:hasPermission>

										</ul>

										<div class="tab-content profile-edit-tab-content">
										
										 
											<div id="edit-basic" class="tab-pane">
											   <form id="contentForm" class="form-horizontal" method="POST">
										    
													    <input type="hidden" id="type" value="${type}" /> <input
												type="hidden" id="userId" name="user.id" value="${user.id }">
											<input type="hidden" name="userDetail.user_id"
												value="${user.id }">
												<h4 class="header blue bolder smaller">基础信息</h4>


												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right"
														for="form-field-username">帐号</label>

													<div class="col-sm-9">
														<c:if test="${'TRUE' eq ISNEW}">
															<input  type="text"
																name="user.username" value="${user.username}" />
														</c:if>
														<c:if test="${'TRUE' ne ISNEW}">
															<input  type="text"
																id="username" name="user.username"
																value="${user.username}" readonly=true />
														</c:if>

													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right"
														for="form-field-first">姓名</label>

													<div class="col-sm-9">
														<input  type="text"
															name="user.username_zh" value="${user.usernameZh}" />
													</div>
												</div>
												
												<div class="form-group">
												      <label class="col-sm-3 control-label no-padding-right"
														for="form-field-first">头像</label>
													<div class="col-sm-9">
														<input id="userAvatar" type="file" /> <input
															type="hidden" id="avatarPath" name="user.avatar"
															value="${user.avatar}" />
													</div>
												</div>
												
												
												<hr />
												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right"
														for="form-field-date">所属机构</label>

													<div class="col-sm-9">
														<div class="input-medium">
															<div class="input-group">
																<fas:select list="${orgList}" listKey="name"
																	listValue="value" cssClass="form-control input-sm"
																	emptyOption="true" name="user.company_id"
																	value="${user.companyId}" headerKey="请选择"
																	headerValue="" />
															</div>
														</div>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right"
														for="form-field-date">出生年月</label>

													<div class="col-sm-9">
														<div class="input-medium">
															<div class="input-group">
																<input class="input-medium date-picker" type="text"
																	name="userDetail.brithday"
																	value="${userDetail.brithday}"
																	data-date-format="yyyy-mm-dd" placeholder="yyyy-mm-dd" />
																<span class="input-group-addon"> <i
																	class="ace-icon fa fa-calendar"></i>
																</span>
															</div>
														</div>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">性别</label>

													<div class="col-sm-9">
														<label class="inline"> <input
															name="form-field-radio" type="radio" class="ace" /> <span
															class="lbl middle"> 男</span>
														</label> &nbsp; &nbsp; &nbsp; <label class="inline"> <input
															name="form-field-radio" type="radio" class="ace" /> <span
															class="lbl middle"> 女</span>
														</label>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">备注</label>
													<div class="col-sm-9">
														<textarea name="userDetail.remark">${userDetail.remark}</textarea>
													</div>
												</div>

												<div class="space"></div>
												<h4 class="header blue bolder smaller">联系方式</h4>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">电子邮箱</label>

													<div class="col-sm-9">
														<span class="input-icon input-icon-right"> <input
															type="email" name="user.email" value="${user.email }" />
															<i class="ace-icon fa fa-envelope"></i>
														</span>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">个人网站</label>

													<div class="col-sm-9">
														<span class="input-icon input-icon-right"> <input
															type="url" name="userDetail.website"
															value="${userDetail.website}" /> <i
															class="ace-icon fa fa-globe"></i>
														</span>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">手机号码</label>

													<div class="col-sm-9">
														<span class="input-icon input-icon-right"> <input
															class="input-medium input-mask-phone" name="user.mobile"
															value="${user.mobile}" type="tel"> <i
															class="ace-icon fa fa-phone fa-flip-horizontal"></i>
														</span>
													</div>
												</div>

												<div class="space"></div>
												<h4 class="header blue bolder smaller">社交帐号</h4>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">QQ号</label>

													<div class="col-sm-9">
														<span class="input-icon"> <input type="text"
															name="userDetail.qq" value="${userDetail.qq }" /> <i
															class="ace-icon fa fa-qq blue"></i>
														</span>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">微信号</label>

													<div class="col-sm-9">
														<span class="input-icon"> <input type="text"
															name="userDetail.wechat" value="${userDetail.wechat }" />
															<i class="ace-icon fa fa-wechat light-green"></i>
														</span>
													</div>
												</div>

												<div class="space-4"></div>

												<div class="form-group">
													<label class="col-sm-3 control-label no-padding-right">新浪微博</label>

													<div class="col-sm-9">
														<span class="input-icon"> <input type="text"
															name="userDetail.xinlangweibo"
															value="${userDetail.xinlangweibo }" /> <i
															class="ace-icon fa fa-weibo red"></i>
														</span>
													</div>
												</div>


												<div class="clearfix form-actions">
													<div class="col-md-offset-3 col-md-9">
														<c:if test="${isEditable}">
															<button class="btn btn-info" type="button"
																onclick="doSave('contentForm');">
																<i class="ace-icon fa fa-check bigger-110"></i> 保存
															</button>
														</c:if>
														<c:if test="${!isCreative && !isEditable}">
															<button type="button" class="btn green"
																onclick="doEdit();">
																<i class="fa fa-edit"></i>编辑
															</button>
														</c:if>
														&nbsp; &nbsp;
														<button class="btn" type="button" onclick="doReturn();">
															<i class="ace-icon fa fa-undo bigger-110"></i> 返回列表
														</button>
													</div>
												</div>
									</form>
								</div>
								

								<div id="edit-password" class="tab-pane">
									<form id="changePwdForm" class="form-horizontal" method="POST">
									<input type="hidden" id="type" value="${type}" /> <input
									type="hidden" id="userId" name="user.id" value="${user.id }">
								<input type="hidden" name="userDetail.user_id"
									value="${user.id }">
										<div class="space-10"></div>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">旧密码</label>

											<div class="col-sm-9">
												<input type="password" id="oldpassword" name="oldpassword" />
											</div>
										</div>

										<div class="space-10"></div>
										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">新密码</label>

											<div class="col-sm-9">
												<input type="password" id="newpassword" name="newpassword" />
											</div>
										</div>

										<div class="space-10"></div>

										<div class="form-group">
											<label class="col-sm-3 control-label no-padding-right">确认密码</label>

											<div class="col-sm-9">
												<input type="password" id="newpassword2" name="newpassword2" />
											</div>
										</div>

										<div class="clearfix form-actions">
											<div class="col-md-offset-3 col-md-9">
												<button class="btn btn-info" type="button"
													onclick="toChangePwd();">
													<i class="ace-icon fa fa-check "></i> 确认修改
												</button>

												&nbsp; &nbsp;
												<button class="btn" type="button" onclick="doReturn();">
													<i class="ace-icon fa fa-undo "></i> 返回
												</button>
											</div>
										</div>
									</form>
								</div>


								<div id="reset-password" class="tab-pane">

									<div class="space-10"></div>
									<div class="row">
										<h4 class="blue smaller lighter">密码重置说明：</h4>
										<div class="col-sm-8" style="height: 100px;">
											<span class="orange">点击"重置密码"按钮,系统将为用户重新生成新的密码,原有密码将失效;
												重置成功后,请妥善保存好新密码。</span>
										</div>
										<div class="col-sm-4" style="height: 100px;">

											&nbsp; &nbsp;
											<button class="btn pull-right" type="button"
												onclick="doReturn();" style="border-width: 1 !important;">
												<i class="ace-icon fa fa-undo"></i> 返回
											</button>

											<button class="btn btn-info pull-right" type="button"
												onclick="toResetPwd();"
												style="border-color: red !important; border-width: 1 !important; margin-right: 10px;">
												<i class="ace-icon fa fa-check"></i> 重置密码
											</button>

										</div>
									</div>
									<div class="row" id="reset-result"></div>
								</div>

								<div id="user-roles" class="tab-pane">

									<div class="space-10"></div>
									<div class="row">
										<div class="col-xs-12">

											<div class="col-xs-12">
												<button class="btn btn-xs btn-yellow  pull-right"
													id="btnCancelResource" onclick="toResetRoleSelect();">
													<i class="ace-icon fa fa-undo icon-on-left"></i>还原
												</button>
												<button class="btn btn-xs btn-yellow  pull-right"
													style="margin-right: 5px;" id="btnSaveResource"
													onclick="toSaveUserRoleList();">
													<i class="ace-icon fa fa-save icon-on-left"></i>保存
												</button>
											</div>
											<div class="hr hr-16 hr-dotted"></div>

											<div class="form-group">

												<div class="col-sm-6">
													<h4 class="row header smaller lighter blue">用户未赋权的角色</h4>
												</div>
												<div class="col-sm-6">
													<h4 class="row header smaller lighter blue">用户已赋权的角色</h4>
												</div>
												<div class="col-sm-12" id="roleSelect"></div>
												<!-- /section:plugins/input.duallist -->
												<div class="hr hr-16 hr-dotted"></div>
											</div>

										</div>
									</div>
								</div>


							</div>
						</div>

					</div>
					<!-- /.span -->
				</div>
				<!-- /.user-profile -->
			</div>





		</div>
		<!-- /.page-content -->
	</div>
	<!-- /.main-content-inner -->
	</div>
	<!-- /.main-content -->
	</div>
	<!-- /.main-container -->



	<!-- 重置密码结果JS模板 -->
	<script id="tmpl-resetpwd-result" type="text/x-jquery-tmpl">
									<div style="height: 100px;  left: 0px; top: 50px;">
											<img src="${ctx}/assets/images/private/success.jpg"
												style="position: absolute; width: 60px;height:60px;margin-left:50px;margin-top:-25px;" />
											<div style="margin-left:130px;margin-top:50px;font-size:20px;">
												密码重置成功！新密码：<span class="green"><strong>{{= newPasword }}</strong></span>
											</div>
										</div>

	</script>


	<!-- 用户角色赋权JS模板 -->
	<script id="tmpl-role-select" type="text/x-jquery-tmpl">
	<select multiple="multiple" size="10" name="userOfRoleSelect" >
		{{each(i,role) rolelist}}
				{{if selected }}
					<option value="{{= role.roleid }}" selected="selected"><span class="green">{{= role.rolename}}</span> [{{= role.orgpath}}]</option>
				{{else}}
					<option value="{{= role.roleid }}"> <span class="green">{{= role.rolename}}</span> [{{= role.orgpath}}]</option>
				{{/if}}
		{{/each}}
	</select>

	</script>



	<%@ include file="/page/public/public-js.jsp"%>
	<script>
		$(function() {
			var initAction = function() {
				isCreative = $
				{
					isCreative
				}
				;
				isEditable = $
				{
					isEditable
				}
				;
				if (isCreative) {
					cmdSave = ctx + "/system/user/save?ISNEW=TRUE";
				} else {
					cmdSave = ctx + "/system/user/save";
				}
				cmdReturn = ctx + "/system/user/show";
			}
			viewControl();
			initAction();
			initFormValidator();
			initChangePwdFormValidator();

			$('.date-picker').datepicker().next().on(ace.click_event,
					function() {
						$(this).prev().focus();
					})

			initContentPage(isEditable);

			$('[data-rel=tooltip]').tooltip();
			$("input[type='password']").capsLockTip();

			initRoleSelect();
			initFileInput();

		});

		function viewControl() {
			var type = $("#type").val();

			if (type == 'changePwd') {
				$("#tab-base").hide();
				$("#tab-security").hide();
				$("#tab-roles").hide();

				$("#tab-resetpwd").show();
				$("#tab-resetpwd").addClass("active");
				$("#edit-password").addClass("in active");
			} else if (type == 'showProfile') {
				$("#tab-base").show();
				$("#tab-security").hide();
				$("#tab-roles").hide();
				$("#tab-resetpwd").hide();

				$("#tab-base").addClass("active");
				$("#edit-basic").addClass("in active");
			} else {
				$("#tab-base").show();
				$("#tab-security").show();
				$("#tab-roles").show();
				$("#tab-resetpwd").show();

				$("#tab-base").addClass("active");
			    $("#edit-basic").addClass("in active");
			}
		}

		function initFormValidator() {
			$('#contentForm').validate({
				rules : {
					'user.username' : {
						required : true
					}
				}
			});
		}

		function initChangePwdFormValidator() {
			$('#changePwdForm').validate({
				rules : {
					oldpassword : {
						required : true,
						oldPasswordCheck : true
					},
					newpassword : {
						required : true,
						regexPassword : true,
						same : true
					},
					newpassword2 : {
						required : true,
						minlength : 6,
						equalTo : "#newpassword"
					}
				},
				messages : {
					oldpassword : {
						required : "请输入旧密码",
						oldPasswordCheck : "旧密码输入有误"
					},
					newpassword : {
						required : "请输入新密码",
						regexPassword : "必须包含字母和数字,长度至少6位的组合",
						same : "新密码不能与旧密码一样"
					},
					newpassword2 : {
						required : "请输入确认密码",
						rangelength : "确认密码不能小于6个字符",
						equalTo : "两次输入密码不一致"
					}
				}
			});
		}

		function toResetPwd() {
			top.bootbox.confirm("确定要重置密码?", function(result) {
				if (result) {
					var url = ctx + "/system/user/resetPassword";
					$.ajax({
						type : 'POST',
						url : url,
						data : {
							userId : $("#userId").val()
						},
						dataType : "json",
						success : function(response) {
							if (response.status == RESULT_SUCCESS) {
								var resultHtml = $("#tmpl-resetpwd-result")
										.tmpl(response.data);
								$('#reset-result').html(resultHtml);
							} else {
								handleAjaxError(response);
							}
						}
					});
				}
			});
		}

		function toChangePwd() {
			if (formCheck("changePwdForm")) {
				doChangePwd();
			}
		}

		function doChangePwd() {
			var url = ctx + "/system/user/changePassword";
			$.ajax({
				"dataType" : 'json',
				"type" : "POST",
				"data" : {
					userId : $("#userId").val(),
					newPassword : $("#newpassword").val()
				},
				"url" : url,
				"success" : function(response) {
					if (response.status == RESULT_SUCCESS) {
						top.bootbox.alert("修改成功");
						$("#changePwdForm")[0].reset();
					} else {
						top.bootbox.alert("修改失败!");
					}

				}
			});
		}

		jQuery.validator.addMethod("same", function(value, element) {
			return this.optional(element) || same(value);
		}, "新密码不能与老密码重复");

		jQuery.validator.addMethod("oldPasswordCheck",
				function(value, element) {
					var oldPassword = $("#oldpassword").val();
					var userId = $("#userId").val();
					var url = ctx + "/system/user/passwordSameCheck";
					var result = false;
					$.ajax({
						"dataType" : 'json',
						"type" : "POST",
						"async" : false,
						"data" : {
							"userId" : userId,
							"oldPassword" : oldPassword
						},
						"url" : url,
						"success" : function(response) {
							if (response.status == RESULT_SUCCESS) {
								result = true;
							} else {
								result = false;
							}
						}
					});

					if (result) {
						return this.optional(element) || true;
					} else {
						return this.optional(element) || false;
					}

				}, "旧密码输入有误");

		jQuery.validator
				.addMethod(
						"regexPassword",
						function(value, element) {
							return this.optional(element)
									|| /^(?=.{6,})(((?=.*[A-Z])(?=.*[0-9]))|((?=.*[a-z])(?=.*[0-9]))).*$/
											.test(value);
						}, "必须包含字母和数字,长度至少6位的组合");

		function same(pwd) {
			var oldpassword = $("#oldpassword").val();
			if (oldpassword == pwd) {
				return false;
			} else {
				return true;
			}
		}

		function initRoleSelect() {
			var url = ctx + "/system/user/findUserOfRoles";
			$.ajax({
				"dataType" : 'json',
				"type" : "POST",
				"data" : {
					userId : $("#userId").val()
				},
				"url" : url,
				"success" : function(response) {
					if (response.status == RESULT_SUCCESS) {
						var roleSelectHtml = $("#tmpl-role-select").tmpl(
								response.data);
						$('#roleSelect').html(roleSelectHtml);

						initBootstrapDualListbox();
					} else {
						handleAjaxError(response);
					}
				}
			});
		}

		function initBootstrapDualListbox() {
			var demo1 = $('select[name="userOfRoleSelect"]')
					.bootstrapDualListbox(
							{
								infoText : '总数 {0}',
								filterTextClear : 'show all',
								filterPlaceHolder : '查找...',
								moveSelectedLabel : '选择当前角色',
								moveAllLabel : '全部选中',
								removeSelectedLabel : '移除当前角色',
								removeAllLabel : '全部取消',
								infoTextEmpty : "记录为0",
								infoTextFiltered : '<span class="label label-purple label-lg">Filtered</span>'
							});
			var container1 = demo1.bootstrapDualListbox('getContainer');
			container1.find('.btn').addClass('btn-white btn-info btn-bold');
		}

		function toSaveUserRoleList() {
			var selectRoleOptions = $("select[name='userOfRoleSelect_helper2']>option");
			var selectedRoleNames = "";
			var roleIds = "";
			var userName = $("#username").val();
			var userId = $("#userId").val();
			if (selectRoleOptions.length == 0) {
				top.bootbox.alert("请至少赋予用户一个角色");
				return false;
			}
			$.each(selectRoleOptions, function(i, value) {
				var $this = $(this);
				selectedRoleNames += (i + 1) + "、" + $this.text() + "<br>";
				roleIds += $this.val() + ",";
			});

			top.bootbox.confirm("确定要赋予用户[" + userName + "]以下角色? ：<br> "
					+ selectedRoleNames, function(result) {
				if (result) {
					var url = ctx + "/system/user/batchSaveUserOfRole";
					$.ajax({
						type : 'POST',
						url : url,
						data : {
							userId : userId,
							roleIds : roleIds
						},
						dataType : "json",
						success : function(response) {
							if (response.status == RESULT_SUCCESS) {
								top.bootbox.alert("保存成功！");
							} else {
								handleAjaxError(response);
							}
						}
					});
				}
			});
		}

		function toResetRoleSelect() {
			initRoleSelect();
		}

		function initFileInput() {
			var uploadUrl = ctx + "/system/attach/ajaxFileUpload";
			var $fileinput = $('#userAvatar');
			var savepath = $("#avatarPath").val();
			var Preview = [];
			var PreviewConfig = [];
			if (savepath) {
				var imageurl = fastDFSDownloadUrl + savepath;
				Preview = [
				//预览图片的设置
				"<img src='" + imageurl + "' class='file-preview-image' >", ];
				PreviewConfig = [ {
					width : '120px',
					url : ctx + "/system/attach/ajaxFileDelete",
					key : savepath,
					extra : {
						savepath : savepath
					},
					frameClass : 'my-custom-frame-css',
					frameAttr : {
						style : 'height:80px',
						title : 'My Custom Title',
					}
				} ];
			}

			$fileinput.fileinput({
				previewClass : 'previewClass',
				mainClass : 'mainClass',
				language : 'zh',
				enctype : "multipart/form-data",
				allowedFileExtensions : [ 'jpg', 'png' ],
				maxFileSize : 10000,
				maxFilesNum : 1,
				uploadExtraData : {
					serviceCode : 'DISH_PIC'
				},
				uploadUrl : uploadUrl,
				deleteUrl : ctx + "/system/attach/ajaxFileDelete",
				showClose : false,
				validateInitialCount : true,
				previewFileIcon : "<i class='glyphicon glyphicon-king'></i>",
				msgFilesTooMany : "选择上传的文件数量({n}) 超过允许的最大数值{m}！",
				initialPreview : Preview,
				initialPreviewConfig : PreviewConfig

			}).on('filedeleted', function(event, key) {//删除后
				$("#avatarPath").val('');
			}).on('filecleared', function(event) {
				$("#avatarPath").val('');
			}).on('fileuploaded', function(event, data, previewId, index) { //上传完成
				console.log('File uploaded triggered previewId=' + previewId);
				console.log(data);
				var form = data.form;
				var files = data.files;
				var extra = data.extra;
				var response = data.response;
				var reader = data.reader;
				//initDishImage(response);
				
				if (response.status == RESULT_SUCCESS) {
					$("#avatarPath").val(response.data.save_path);
				}
			
			}).on('filebrowse', function(event) {//点击【选择】按钮
			}).on('fileloaded',
					function(event, file, previewId, index, reader) {
					}).on('filereset', function(event) {
			}).on('filepreclear', function(event) {
			}).on('fileclear', function(event) {
			}).on('filepredelete', function(event, key) {//删除前
			}).on('filepreupload', function(event, data, previewId, index) { //准备上传
			}).on("filebatchselected", function(event, files) {//选择文件时调用
			}).on("fileselectnone", function(event, files) {
			}).on("filelock", function(event, filestack, extraData) {
			}).on("fileunlock", function(event, filestack, extraData) {
			}).on('filedeleteerror', function(event, data) { //删除异常
			}).on("filebatchuploadsuccess", function(event, files) {
			}).on("filebatchuploaderror", function(event, files) {
			}).on("filebatchpreupload", function(event, files) {
			}).on('filebatchuploadcomplete', function(event, files, extra) {//批量上传全部完成
			});

			if (!isEditable) {
				$('#userAvatar').fileinput('disable');
			}
		}

		function initDishImage(returnData) {
			alert();
			var id = 1;
			var $imageInput = $('#userAvatar');
			var imageurl = fastDFSDownloadUrl + returnData.data.savepath;
			var attid = returnData.data.attid;

			if (returnData.status == 'error') {
			} else {
				$("#avatarPath").val(returnData.data.savepath);
				//重要，需要更新控件的附加参数内容，以及图片初始化显示
				$imageInput
						.fileinput(
								'refresh',
								{
									deleteExtraData : {
										attid : attid,
										savepath : returnData.data.savepath
									},
									deleteUrl : ctx
											+ "/system/attach/ajaxFileDelete",
									showUpload : false,
									initialPreview : [
											//预览图片的设置
											"<img src='" + imageurl + "' class='file-preview-image' alt='肖像图片' title='肖像图片' style='max-width:400px;width:200px;height:160px;'>", ],
									initialPreviewConfig : [ {
										caption : '照片',
										url : ctx
												+ "/system/attach/ajaxFileDelete",
										key : returnData.data.savepath,
										width : '100%',
										extra : {
											attid : attid,
											savepath : returnData.data.savepath
										}
									} ]
								});
				$imageInput.fileinput('enable');
				$imageInput.fileinput('upload');
			}
		}
	</script>

</body>
</html>
